<template>
	<view style="background-color: #eee;display: flex;flex-direction: column;" >
		<block v-for="(item,index) in list" :key="index">
			<view class="item" @click="openMini(item)">
				<view class="titleview">
					<view class="lefttitle">
						<image :src="item.iconUrl" class="iconImage"></image>
						<view class="title">{{item.title}}</view>
						<view class="describe">{{item.describe}}</view>
					</view>
					<view class="opentitle">立即打开</view>
				</view>
				
				<view style=" display: flex;margin-top: 20rpx;">
					<image :src="item.backimage" class="image" mode="aspectFill"></image>
				</view>
			</view>
		</block>
		<u-popup ref="share" mode="center" border-radius="10">
			<shareView :callback="shareCallback" title="每日分享一次才能获取优惠券"></shareView>
		</u-popup>
	</view>
</template>

<script>
	import shareView from "@/pages/wm/share/main.vue";
	import dateTool from '@/common/utils/dateTool.js';
	var _this = null;
	export default {
		components:{shareView},
		data() {
			return {
				list:[],
			}
		},
		onShareAppMessage(options) {
			return this.$shareUtils.share({
				options,
				imageUrl:'https://cdn.ujuec.com/mobile/Public/img/wm/eleme_p1.png',
				title: '该点外卖了,再苦不能苦了胃,点击领取大额优惠券'
			});
		},
		onLoad() {
			_this = this;
			this.fetchData();
		},
		methods: {
			shareCallback(p){
				_this.$refs.share.close();
				if(p == 1){
					uni.setStorageSync(dateTool.getTimeFromat('')+"wmshare","1");
				}
			},
			fetchData(){
				this.list = uni.getStorageSync("wm");
				let wm_id = null;
				if(this.list.length > 0){
					wm_id = this.list[this.list.length - 1].wm_id;
				}
				this.$request.post({
					url: "/mSystem/wmList",
					header:{wm_id:wm_id},
					success:(res)=> {
						uni.hideLoading();
						this.list = res;
						if(res.length > 0) uni.setStorageSync("wm",res);
					},
					fail(failed) {
						uni.hideLoading();
					}
				});
			},
			openMini(item){
				let isShare = uni.getStorageSync(dateTool.getTimeFromat('')+"wmshare");
				if(this.$u.test.empty(isShare)){
					this.$refs.share.open();
					return ;
				}
				wx.navigateToMiniProgram({
				    appId: item.wx_app_id,
				    path: item.path,
				    envVersion: 'release',// 打开正式版
				    success(res) {
				         // 打开成功
						 console.log(res);
				    },
				    fail: function (err) {
				      console.log(err);
				    }
				 })
			}
		}
	}
</script>

<style lang="stylus" scoped>
	.item{
		margin-left 20rpx;
		margin-right 20rpx;
		margin-top 20rpx;
		border-radius 10rpx;
		background-color #fff;
		padding-left 20rpx;
		padding-right 20rpx;
		display flex;
		flex-direction column;
		
		.titleview{
			display flex;
			justify-content space-between;
			align-items center;
			margin-top 20rpx;
		
			.lefttitle{
				display flex;
				align-items center;
				
				.iconImage{
					// margin-left 20rpx;
					width: 30rpx;height: 30rpx;
				}
				
				.title{
					margin-left 20rpx;
					font-size 32rpx;
					font-weight bold;
				}
				
				.describe{
					margin-left 20rpx;
					font-size 20rpx;
					background-color rgb(245,225,225);
					color rgb(218,74,60);
					height 40rpx;
					line-height 40rpx;
					text-align center;
					border-radius 15rpx;
					width 100rpx;
				}
			}
			.opentitle{
				// margin-right 20rpx;
				background-color rgb(245,51,51);
				color #fff;
				width 150rpx;
				height 50rpx;
				line-height 50rpx;
				border-radius 25rpx;
				text-align center;
				font-size 26rpx;
			}
		}
		
	}
	.image{
		width 100%;
		height 240rpx;
		border-radius 10rpx;
		margin-bottom 20rpx;
	}
	
</style>
